<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>坦克大战</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div id="gameContainer">
        <canvas id="gameCanvas" width="800" height="600"></canvas>
        <div id="ui">
            <div id="scoreBoard">
                <span>玩家1: <span id="score1">0</span></span>
                <span>生命: <span id="lives1">3</span></span>
                <span id="score2Container" style="display: none;">
                    | 玩家2: <span id="score2">0</span>
                    生命: <span id="lives2">3</span>
                </span>
            </div>
            <div id="gameMenu" class="menu">
                <h1>坦克大战</h1>
                <button id="singlePlayerBtn">单人游戏</button>
                <button id="multiPlayerBtn">双人游戏</button>
                <button id="helpBtn">帮助说明</button>
            </div>
            <div id="gameOver" class="menu" style="display: none;">
                <h2>游戏结束</h2>
                <p id="finalScore">最终得分: 0</p>
                <button id="restartBtn">重新开始</button>
                <button id="menuBtn">返回主菜单</button>
            </div>
            <div id="helpMenu" class="menu" style="display: none;">
                <h2>游戏说明</h2>
                <p>玩家1: WASD移动，空格射击</p>
                <p>玩家2: 方向键移动，回车键射击</p>
                <p>摧毁敌方坦克获得分数，收集道具提升能力</p>
                <button id="backBtn">返回</button>
            </div>
        </div>
    </div>
    <script src="game.js"></script>
</body>
</html>
